<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>控制中心</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <meta content="telephone=no" name="format-detection" />
    <script src="js/vue.js"></script>
    <link rel="stylesheet" href="js/layui/css/layui.css">
    <style>
        .layui-logo{position:absolute;left:0;top:0;width:200px;height:100%;line-height:60px;text-align:center;color:#fff;font-size:16px}
        body{
            padding: 0;
            margin: 0;
            width: 100%;
            height: 100%;
        }
    </style>
</head>
<body  class="layui-layout-body" style="height: 100%;width: 100%;">
<div class="layui-layout layui-layout-admin" id="APP" style="height: 100%;width: 100%;">
    <div class="layui-header layui-bg-green" >
        <div class="layui-logo" style="color: #fff">Danmu~</div>
        <ul class="layui-nav layui-bg-green layui-layout-left" lay-filter="top">
            <li class="layui-nav-item layui-this"><a href="danmu">弹幕</a></li>
            <li class="layui-nav-item "><a href="">统计</a></li>
            <li class="layui-nav-item "><a href="setting">设置</a></li>
        </ul>
        <ul class="layui-nav layui-bg-green layui-layout-right">
            <li class="layui-nav-item" lay-unselect="">
                <a href="javascript:;"><img src="img/taomei.png" class="layui-nav-img">涛妹</a>
                <dl class="layui-nav-child">
                    <dd><a href="javascript:;">修改信息</a></dd>
                    <dd><a href="javascript:;">退出</a></dd>
                </dl>
            </li>
        </ul>
    </div>

    <!--<div class="layui-side">-->
    <!--<ul class="layui-nav layui-nav-tree layui-bg-cyan layui-inline" lay-filter="demo">-->
    <!--<li class="layui-nav-item layui-nav-itemed">-->
    <!--<a href="javascript:;">弹幕</a>-->
    <!--<dl class="layui-nav-child">-->
    <!--<dd><a href="javascript:;">页内打开</a></dd>-->
    <!--<dd><a href="javascript:;">新网页打开</a></dd>-->
    <!--</dl>-->
    <!--</li>-->
    <!--<li class="layui-nav-item">-->
    <!--<a href="javascript:;">设置</a>-->
    <!--</li>-->
    <!--<li class="layui-nav-item"><a href="">统计页</a></li>-->
    <!--</ul>-->
    <!--</div>-->

    <iframe class="iframe" name="mainFrame" id="mainFrame"  src="danmu" style="width:100%; height:100%;"
            frameborder="no" border="0" marginwidth="0" marginheight="0" allowtransparency="yes"></iframe>

</div>



<script src="js/layui/layui.all.js"></script>

<script>
    var $;
    var bodyHeight=0;
    var bodyWidth=0;
    layui.use('element', function(){
        var element = layui.element; //导航的hover效果、二级菜单等功能，需要依赖element模块
        $=layui.jquery;
        //监听导航点击
        element.on('nav(demo)', function(elem){
            //console.log(elem)
            layer.msg(elem.text());
        });
        bodyHeight=document.documentElement.clientHeight;
        bodyWidth=document.documentElement.clientWidth;
        console.log(">>>>>>>>>>bodyHeight:"+bodyHeight)

        $(".iframe").height(bodyHeight-60);
        $(".iframe").width(bodyWidth);
    });
</script>
</body>

</html>